<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>这是我的第四个</title>
    <link rel="stylesheet" href="./test1.css">
    <style>
    
    </style>
</head>

<body>
    v  tvds6t
    <div id="'container" style="width:500px">
    
    <div id="header" style="background-color:#FFA500;">
    <h1 style="margin-bottom:0;">测试主要的网页标题</h1></div>

    <div id="menu" style="background-color:#FFD700;height:200px;width:100px;flOat:left;">
    <b>测试1</b><br>
    测试2<br>
    测试3<br>
    测试4</div>

    <div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left">这是测试内容在这里</div>

    <div id="footer" style="background-color:#FFA500;clear;both;text-align:center;">版权© runoob.com</div>
    
    </div>
    <canvas id="myCanvas" width="200px"height="100px" style="border:1px solid #e7081b;">
    </canvas>

    <script>
        
    var c = document.getElementById("myCanvas");
    var ctx = c.getContext("2d");

    // Create gradient
    var grd=ctx.createRadialGradient(75,50,5,90,60,100);
    grd.addColorStop(0,"red");
    grd.addColorStop(1,"white");

    // Fill with gradient
    ctx.fillStyle=grd;
    ctx.fillRect(10,10,150,80);

    </script>
    <h1>CSS 实例</h1>
<p>这是一个段落</p>
</body>
</html>